<!DOCTYPE html>
<html lang="zh-cn">
	<head>
		<title>订单提交</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta charset="UTF-8">
        <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
            $(".daohang4tan").hide();
            $(".daohang5tan").hide();
            
            $(".daohang4,.daohang4tan").hover(function(){
                $(".daohang4").css({"background":"white","border":"1px solid #EEEEEE"});
                $(".daohang4tan").show();
            },function(){
                $(".daohang4").css({"background":"#F5F5F5","border":"0px"});
                $(".daohang4tan").hide();
            });

            $(".daohang5,.daohang5tan").hover(function(){
                $(".daohang5").css({"background":"white","border":"1px solid #EEEEEE"});
                $(".daohang5tan").show();
            },function(){
                $(".daohang5").css({"background":"#F5F5F5","border":"0px"});
                $(".daohang5tan").hide();
            });
        });
        </script>
        <script type="text/javascript">
        $(function() {
            setTimeout("changeDivStyle();", 100); // 0.1秒后展示结果，因为HTML加载顺序，先加载脚本+样式，再加载body内容。所以加个延时
        });
        function changeDivStyle(){
        //		var o_status = $("#o_status").val();	//获取隐藏框值
            var o_status = 4;
            if(o_status==0){
                $('#create').css('background', '#DD0000');
                $('#createText').css('color', '#DD0000');
            }else if(o_status==1||o_status==2){
                $('#check').css('background', '#DD0000');
                $('#checkText').css('color', '#DD00000');
            }else if(o_status==3){
                $('#pay').css('background', '#DD0000');
                $('#payText').css('color', '#DD0000');
            }else if(o_status==4){
                $('#reiceved').css('background', '#DD0000');
                $('#reicevedText').css('color', '#DD0000');
            }else if(o_status>=5){
                $('#assess').css('background', '#DD0000');
                $('#assessText').css('color', '#DD0000');
            }
        }
        </script>
        <!--begin header css -->
        <style>
            *{margin:0;padding:0;list-style-type:none;}
            a,img{border:0;}
            body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";}
            .hui{
                background: #f5f5f5;
                width:100%;
                height:40px;
                position:relative;
                margin:0px;
                border:1px solid #EEEEEE;
            }
            .daohang{

                width:420px;
                height:40px;
                position:absolute;
                right:162px;
            }
            .daohang div a{
                font-size:14px;
                margin-left:20px;
                margin-top:10px;
                text-decoration:none;
                display:block;
                color:black;
            }
            .daohang div a:hover{
                font-size:14px;
                margin-left:20px;
                margin-top:10px;
                text-decoration:none;
                display:block;
                color:#F22E00;
            }
            .daohang1{
                width:70px;
                height:40px;
                position:absolute;
            }
            .daohang2{
                width:70px;
                height:40px;
                position:absolute;
                margin-left:70px;
            }
            .daohang3{
                width:70px;
                height:40px;
                position:absolute;
                margin-left:140px;
            }
            .daohang4{
                width:110px;
                height:40px;
                position:absolute;
                margin-left:210px;
                border:0px;
            }
            .daohang5{
                width:100px;
                height:40px;
                position:absolute;
                margin-left:320px;
            }
            .daohang4tan{
                width:110px;
                height:100px;
                border:1px solid #EEEEEE;
                margin-left:210px;
                margin-top:40px;
                position:absolute;
                background:white;
                z-index:9;
            }
            .daohang5tan{
                width:100px;
                height:100px;
                border:1px solid #EEEEEE;
                margin-left:320px;
                margin-top:40px;
                position:absolute;
                background:white;
                z-index:9;
            }
            .zhiwei{
                cursor:pointer;
                text-align:left;
                line-height:80px;
            }
            .zhiwei:hover{
                color:#FF4400;
                text-decoration:underline;
            }
             .gongsi{
                cursor:pointer;
                text-align:center;
                line-height:80px;
            }
            .gongsi:hover{
                color:#FF4400;
                text-decoration:underline;
            }
            .order-go {
                height:100px;
                width:400px;
                position: relative;
                margin-top: 10px;
                float: right;
                z-index: 100;
                padding: 3px;
                border: 1px solid #f50;
                font-family: tahoma;
                font-size: 12px;
                display: inline-block;
                right: 0;
                background-color: #fff0e8;
            }
			.coffee{
				color:black;
				text-decoration:none;
			}
			.coffee:hover{
				color:#FF5500;
			}
            .stepInfo{position:relative;background:#f2f2f2;margin:0px auto 0 400px;width:600px;}
            .stepInfo li{float:left;width:12%;height:0.8em;background:#bbb;}
            .stepIco{border-radius:1.8em;padding:0.03em;background:#bbb;text-align:center;line-height:3em;color:#fff; position:absolute;width:3em;height:3em;}
            .stepIco1{top:-0.9em;left:-1%;}
            .stepIco2{top:-0.9em;left:21%;}
            .stepIco3{top:-0.9em;left:46%;}
            .stepIco4{top:-0.9em;left:71%;}
            .stepIco5{top:-0.9em;left:95%;}
            .stepText{color:#666;margin-top:0.1em;width:6em;text-align:center;margin-left:-1.4em;}
        </style>
    </head>
    <body>
        <!--begin header-->
        <div class="hui">
            <div class="daohang">
                <div class="daohang1"><a href="php/index.php">首页</a></div>
                <div class="daohang2"><a href="php/login.php">登录</a></div>
                <div class="daohang3"><a href="php/register.php">注册</a></div>
                <div class="daohang4"><a href="#">我的淘兼职</a></div>
                <div class="daohang5"><a href="#">关于我们</a></div>

                <div class="daohang4tan"><a href="php/gerenzhongxin.php">个人中心</a><a href="#">添加修改简历</a><a href="#">查看招聘信息</a></div>
                <div class="daohang5tan"><a href="#">网站简介</a><a href="#">组织结构</a><a href="#">发展历程</a></div>
            </div>
        </div>
        <!--container-->
        <div class="container" style="border:0px solid red;width:1024px;top:20px;height:900px;position:relative;margin:0 auto;cursor:default;">
            <div style="width:300px;height:100px;border:0px solid green;position:absolute;">
                <img src="img/taologo.jpg" style="width:160px;">
                <div style="background:#DEDEDE;width:1px;height:58px;margin-left:170px;margin-top:-75px;"></div>
                <p style="color:#666666;font-size:27px;margin-left:190px;margin-top:-48px;font-weight: bold">下单</p>
            </div><!--头部-->

            <!--buy-stepbar-->
            <br><br>
            <input type="hidden" value=${detailorder.status } id="o_status" /><!--后台传到页面的数据-->
            <div class="stepInfo ">
                <ul>
                    <li style="background: red"></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
                <div class="stepIco stepIco1" id="create" style="background:#F22E00;">1
                    <div class="stepText" id="createText" style="color:#F22E00">确认订单信息</div>
                </div>
                <div class="stepIco stepIco2" id="check">2
                    <div class="stepText" id="checkText">等待卖家确认</div>
                </div>
                <div class="stepIco stepIco3" id="pay">3
                    <div class="stepText" id="payText">支付服务费</div>
                </div>
                <div class="stepIco stepIco4" id="received">4
                    <div class="stepText" id="receivedText">确认兼职</div>
                </div>
                <div class="stepIco stepIco5" id="assess">5
                    <div class="stepText" id="assessText">双方互评</div>
                </div>
            </div>
            <br><br><br><br><br><br>
            <div class="buy-order-field " >
                <h2>确认订单信息</h2>
                <br>
                <div style="height:35px">
                    <span style="width:350px; margin-left:0; height:24px; text-align: center;border-bottom:3px solid #b2d1ff; font-size:12px;float:left;">兼职名称</span>
                    <span style="width:270px; margin-left:0; height:24px; text-align: center;border-bottom:3px solid #b2d1ff; font-size:12px;float:left;">公司名称</span>
                    <span style="width:147px; margin-left:0; height:24px; text-align: center;border-bottom:3px solid #b2d1ff; font-size:12px;float:left;">工作时间</span>
                    <span style="width:117px; margin-left:0; height:24px; text-align: center;border-bottom:3px solid #b2d1ff; font-size:12px;float:left;">是否冲突</span>
                    <span style="width:138px; margin-left:0; height:24px; text-align: center;border-bottom:3px solid #b2d1ff; font-size:12px;float:left;">中介费</span>
                </div>
                <table rules=rows id="liebiao" border="0" width="1024" align="center" Bordercolor=#b2d1ff>
                    <tbody>
                    <tr bgcolor="#fafcff" height="130" align="center">
                        <td width="12%" align="left"><img src="img/coffee.jpg" style="width:80px;height:80px;cursor:pointer;padding-left:7px"></td>
                        <td width="22%" class="zhiwei"><a href="gangweigoumai.html" class="coffee">BARONET COFFEE咖啡制作师</a></td>
                        <td width="27%" class="gongsi">BARONET COFFEE</td>
                        <td width="15%">2015年12月1日8:00-9:00</td>
                        <td width="14%">未冲突</td>
                        <td width="12%">¥5</td>
                    </tr>
                    <tr bgcolor="#fafcff" height="130" align="center">
                        <td align="left"><img src="img/sofa.jpg" style="width:80px;height:80px;cursor:pointer;padding-left:7px"></td>
                        <td class="zhiwei">鄞州宜家家居销售员</td>
                        <td class="gongsi">宜家集团</td>
                        <td>2016年2月10日~2016年3月10日12:00-15:00</td>
                        <td >未冲突</td>
                        <td>¥6</td>
                    </tr>
                    <tr bgcolor="#fafcff" height="130" align="center">
                        <td align="left"><img src="img/milk.jpg" style="width:80px;height:80px;cursor:pointer;padding-left:7px"></td>
                        <td class="zhiwei">hhh牛奶促销员</td>
                        <td class="gongsi">hhh牛奶公司</td>
                        <td>2016年2月24日9:00-14:00</td>
                        <td >未冲突</td>
                        <td>¥5</td>
                    </tr>
                    </tbody>
                </table>
               
            </div>
            <br><br>
            <div style="height:200px;width:100%">
            <div >
                <div style="float:right">
                    <br>
                    <b style="font-size:15px;font-weight: 700">实付款：</b>
                    <span class="price g_price ">
                        <span style="font-size: 26px;color: #ff4200">￥</span>
                        <em style="color: #ff4200;font: 700 26px tahoma;">16.00</em>
                    </span>
                    
                </div>
                
                <div style=float:right;clear:right;">
                    <br>
                    <a href="" style="color:#f50">预览兼职日程</a>
                </div>
                    
            </div>
          <p style="margin-left: 860px;"><input type="submit" name="submit" value="提交订单"style="border:0;background-color: #FF5500;height: 40px;width: 180px;font-size: 20px;font-weight:600;color: #ffffff"></p>
          <a href="gouwuche.html" style="margin-top:-30px;margin-left:750px;display:block;text-decoration:none;color:#3366CC;font-size:14px;"><img style="width:25px;height:25px;" src="img/fanhui.jpg">返回购物车</a>
            </div>
            
            

        </div>

        <div style="position:absolute;top:900px;height:50px;width:100%;border-top:1px solid #D2D0D0;margin-top: 40px;">
            <div align="center"style="margin-top: 15px;">@Taojianzhi.com</div>
        </div>
    </body>
  </html>